<template>
	<view style="width: 100%; height: 100%;">
		<block v-for="(day, day_idx) in days">
			<view class="grey mg-h-lg mg-v-md">{{day.day}}</view>
			<view class="radius2 bk-white pd-lg mg-h-lg lay-c-c" @click="onExpand(day)">
				<view class="flex1">
					<view class="text-xxxl">{{day.sumProfit}}</view>
					<view class="lay-fs-c mg-t-lg text-md grey">
						<view>{{"收入："+day.sumPrice}}</view>
						<view class="pd-l-md">{{"回鱼："+day.sumRetMoney}}</view>
						<view class="pd-l-md">{{"总杆数："+day.countNum}}</view>
					</view>
				</view>
				<view v-if="day.expand" class="iconfont icon-xiangxia"></view>
				<view v-else class="iconfont icon-xiangshang"></view>
			</view>
			
			<block v-if="day.expand">
				<view class="grey mg-h-lg mg-t-lg mg-b-sm lay-c-c">
					<view v-for="(col_name, index) in headerCols" class="flex1 lay-c-c" :key="index">{{col_name}}</view>
				</view>
				<view class="bk-white mg-h-lg table text-sm">
					<view v-for="(row, row_idx) in day.dayPonds" :key="row_idx" class="row">
						<view v-for="(cell_value, col_idx) in row" class="flex1 lay-c-c" :key="col_idx">{{cell_value}}</view>
					</view>
				</view>
			</block>
			
			<view class="vspace-xl"></view>
		</block>
		
		<view v-if="days.length < 1" class="lay-c-c mg-t-xxl">
			<text>{{loading?"加载中...":"没有数据"}}</text>
		</view>
		<block v-else>
			<view class="lay-c-c mg-h-lg pd-lg darkblue" @click="onLoadMore">
				{{hasMoreData?"加载更多":"没有更多数据了"}}
			</view>
		</block>
		
	</view>
</template>

<script>
	import { getMerDayOrders } from "@/api/fsh.js";
	export default {
		data() {
			return {
				days: [
				],
				headerCols: [],
				hasMoreData: true,
				loading: true,
			}
		},
		onLoad(options) {
			console.log("day_orders::onLoad, options:", options);
            this.merId = options.merId;
			this.getMerDayOrders('', 1);
		},
		methods: {
			onExpand(day) {
				day.expand = !day.expand;
			},
			
			onLoadMore() {
				if(!this.hasMoreData)
					return;
					
				let fromDay = '';
                if(this.days.length > 0) {
                    fromDay = this.days[this.days.length - 1].day;
					let d = new Date(Date.parse(fromDay));
					d.setDate(d.getDate()-1); // 日期减少1天
					fromDay = d.format("yyyy-MM-dd");
				}
                this.getMerDayOrders(fromDay);
			},
            
            getMerDayOrders(fromDay, needTbHeader) {
				this.loading = true;
                getMerDayOrders(this.merId, fromDay, needTbHeader).then(res=>{
					this.loading = false;
					res.entity.daySums.forEach(a=>a.expand = false);
					if(res.entity.daySums.length < 1)
						this.hasMoreData = false;
					else
						this.days = this.days.concat(res.entity.daySums);
					if(res.entity.headers)
						this.headerCols = res.entity.headers;
                }).catch(err=>{
					this.loading = false;
                    console.error("getMerDayOrders fail:", err);
                });
            }
		}
	}
</script>

<style lang="scss" scoped>
	page {
		height: 100vh;
		width: 100vw;
	}
	@import "@/leui.scss";
	
	.table {
		@extend .pd-v-sm;
		
		>.row {
			@extend .lay-c-c;
			line-height: 60rpx;
		}
	}
	
</style>
